<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>login2</title>
    <link rel="stylesheet" href="/static/commons.css" />
    <style>
        label{
            width: 80px;
            text-align: right;
            display: inline-block;
        }
    </style>
</head>
<body>
    <form action="/cmdb/login3" method="post">
        {{ csrf_token }}
        {% csrf_token %}
        <p>
            <label for="username">用户名：</label>
            <input id="username" name="user" type="text" />
        </p>
        <p>
            <label for="password">密码：</label>
            <input id="password" name="pwd" type="password" />
            <input type="submit" value="提交" />
        </p>
        <p>
            <input id="btn" type="button" value="按钮">
        </p>
    </form>

<script src="https://cdn.staticfile.org/jquery/3.4.0/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script>
    $(function (){

        function csrfSafeMethod(method){
            // these HTTP methods do not require CSRF protection
            return (/^(GET|HEAD|OPTIONS|TRACE)$/.test(method));
        }

        {#全局配置ajax#}
        $.ajaxSetup({
            beforeSend: function (xhr,settings){
                if (!csrfSafeMethod(settings.type) && !this.crossDomain) {
                    xhr.setRequestHeader('X-CSRFtoken',$.cookie('csrftoken'));
                }
            }
        })

        const csrftoken = $.cookie('csrftoken');
        $('#btn').click(function (){
            $.ajax({
                url: '/cmdb/login3',
                type: "POST",
                {#headers: {'X-CSRFtoken':csrftoken},#}
                data: {'user': 'root', 'pwd': '123'},
                success:function (arg){

                }
            })
        })
    })

</script>

{#可爱小人插件#}
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
  <!--小帅哥： https://unpkg.com/live2d-widget-model-chitose@1.0.5/assets/chitose.model.json-->
  <!--萌娘：https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json-->
  <!--小可爱（女）：https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json-->
  <!--小可爱（男）：https://unpkg.com/live2d-widget-model-haruto@1.0.5/assets/haruto.model.json-->
  <!--初音：https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json-->
  <!-- 上边的不同链接显示的是不同的小人，这个可以根据需要来选择 下边的初始化部分，可以修改宽高来修改小人的大小，或者是鼠标移动到小人上的透明度，也可以修改小人在页面出现的位置。 -->
  <script>
    /*https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json*/
    L2Dwidget.init({ "model": { jsonPath:
          "https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json",
        "scale": 1 }, "display": { "position": "right", "width": 110, "height": 200,
        "hOffset": 0, "vOffset": -20 }, "mobile": { "show": true, "scale": 0.5 },
      "react": { "opacityDefault": 0.8, "opacityOnHover": 0.1 } });
  </script>

</body>
</html>